<template>
  <div class="user">
    <div class="users">
      <div class="user-top">
        <van-image
          round
          width="6rem"
          height="6rem"
          :src="userInfo.avatar|diaImg"
        />
        <p>{{ userInfo.nickName?userInfo.nickName:userInfo.userName }}</p>
        <span>积分:{{ userInfo.score }}</span>
      </div>
      <van-button
        color="linear-gradient(to right, #ff6034, #ee0a24)"
        class="muto"
        icon="star-o"
        block
        @click="checkIn"
      >
        签到
      </van-button>
      <van-cell
        is-link
        title="用户资料"
        :to="{ name: 'UserInfo' }"
      />
      <van-cell is-link title="修改资料"  :to="{name:'UserInfoalt'}"/>
      <van-cell is-link title="更多信息" />
      <van-cell is-link title="关于软件" />
      <van-button type="info" class="muto" block @click="logiout"
        >退出</van-button
      >
    </div>
  </div>
</template>
<script>
import { removeToken } from "../utils/auth";
import { mapState, mapActions} from "vuex";
// import moment from 'moment';
import { Notify } from "vant";
export default {
  data() {
    return {
      count: 0,
    };
  },
  mounted() {
  //   if (window.history && window.history.pushState) {
  //     // 往历史记录里面添加一条新的当前页面的url
  //     history.pushState(null, null, document.URL);
  //     // 给 popstate 绑定一个方法 监听页面刷新
  //     window.addEventListener("popstate", this.backChange, false);
  //   }
  // },
  // destroyed() {
  //   window.removeListener("popstate", this.backChange, false);
  // },
  },
  created() {
      this.loadData();
  },
  computed: {
    ...mapState("userinfo", ["userInfo", "data"]),
    ishidden: {
      get() {
        return this.$store.state.userinfo.ishidden;
      },
      set(v) {
        this.$store.state.userinfo.ishidden = v;
      },
    },
  },

  methods: {
    // 加上async可以让异步函数按顺序执行
    async loadData() {
      await this.getUser();
    },
    // count重置
    flush() {},
    // 签到
    async checkIn() {
      if (this.count > 0) {
        Notify({
          type: "warning",
          message: "今天已经签到过了哦",
        });
        return false;
      } else {
        await this.check();
        this.loadData();
        if (this.data.code == 1) {
          Notify({
            message: this.data.msg,
            type: "success",
          });
        }
        this.count++;
      }
    },
    ...mapActions("userinfo", {
      // 获取用户信息
      getUser: "getUser",
      // 签到
      check: "check",
    }),
    logiout() {
      removeToken();
      this.$store.commit("cartsCount/clearCar");
      this.$router.replace("/");
    },
  },
  watch: {},
};
</script>

<style scoped>
.user-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
  background-color: rgb(226, 175, 232);
  height: 190px;
}
.muto {
  width: 30vw;
  margin: 5px auto;
}
</style>
